<style scoped>
html{
    background: #fafafa;
}
#forgetPass,#register{
    padding: 5px;
}
.panel-default>.panel-heading{
    color:#337ab7;
}
.panel-title{
    font-size: 20px;
}
#register-forget-pannel{
    margin-top: 2px;
}
#u1{
    list-style: none;
    float: left;
    padding-left: 0px;
}
#u1 li{
    float: left;
    padding-right: 8px;
}
a,a:hover{
    text-decoration: none;
}
#demo-canvas{
    position: fixed;
    left: 0px;
    bottom: 0px;
    z-index: -9;
}
.container{
    width: 400px;
    margin: 60px auto 0;
    padding: 50px 50px 30px;
    background-color: rgba(255,255,255,.8);
    border-radius: 4px;
    box-shadow: 0 0 8px rgba(0,0,0,.1);
    vertical-align: middle;
    display: inline-block;
}
.btn-success{
    background-color: #42b983
}
.sign{
    height: 100%;
    min-height: 750px;
    text-align: center;
    font-size: 14px;
    background-color: #eaeaea;
}
.title_active{
    color: #42b983;
    font-weight: 700;
    border-bottom: 2px solid #42b983;
}
.panel-title{
    margin: 0 10px;
    padding: 10px;
}
.preview_headimg{
    padding: 20px 50px!important;
}
.preview{
    padding: 20px;
}
.preview canvas{
    width: 100%;
    height: auto;
    max-width: 300px;
}
.preview img{
    width: 100%;
    height: auto;
}
</style>
<template>
    <div class="sign large-header" id="large-header">
    <canvas id="demo-canvas"></canvas>
            <div class="container">
                <div class="login-panel">
                    <div class="panel-heading">
                        <a href="/login" class="panel-title title_active">登录</a><b>.</b><a href="/" class="panel-title">注册</a>
                    </div>
                    <div class="panel-body">
                        <form id="loginForm" role="form">
                            <fieldset>
                                <div class="form-group">
                                    <input v-model="username" class="form-control" placeholder="账号" name="username" type="text" autofocus>
                                </div>
                                <div class="form-group">
                                    <input v-model="password" class="form-control" placeholder="密码" name="password" type="password" value="">
                                </div>
                                <!-- Change this to a button or input when using this as a form -->
                                <a href="/" class="btn btn-lg btn-success btn-block">登录</a>
                                <div id="register-forget-pannel" class="form-group">
                                    <a style="float: left;" href="/">注册账号</a>
                                </div>
                            </fieldset>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    export default {
        data:function(){
            return{
               username:"",
                password:""
            }
        },
        methods:{
            loginBtn:function(){
                console.log(1);
                // if(this.username=="" || this.password==""){
                //     alert("账号或密码输入不能为空")
                // }else{
                //   axios.post('/login/launch', {
                //     username: this.username,
                //     password: this.password
                //   })
                //   .then(function (response) {
                //     if(response.data.status == true){
                //         alert("登录成功")
                //         window.location.href = "/blog"
                //     }else{
                //         alert("登录失败，账号或密码错误")
                //     }
                //     console.log(response);
                //   })
                //   .catch(function (error) {
                //     console.log(error);
                //   });
                // }
            }
        }
    };
</script>
